/* FSD Javascript Desktop 0.1.0| by Leo Sun | (c) 2015 Leo Sun. | Licensed under MIT | 2015-10-06 23:04:49 | QQ:1055532121 | website: http://fsd.online */

requirejs.config({
    shim: {
        'underscore': {
            exports: '_'
        },
        'backbone': {
            deps: ['underscore', 'jQuery'],
            exports: 'Backbone'
        },
        "AmazeUI": {
            deps: ["jQuery"]
        }
    },

    baseUrl: 'bower_components',
    paths: {
        "jQuery": "Jquery/jquery-2.1.3.min",
        "underscore": "UnderscoreJS/underscore-min",
        "backbone": "Backbone/backbone-min",
        "domReady": "RequireJS/domReady",
        "AmazeUI": "AmazeUI-2.4.2/assets/js/amazeui.min",
        "FSDCommonJS": "fsd.online/js/FSDCommonJS"
    }
});
requirejs(['jQuery', 'FSDCommonJS', 'domReady', 'underscore', 'backbone', "AmazeUI"], function ($, FSDCommonJS, domReady, _, Backbone) {
    domReady(function () {
        (function ($) {

            //阻止默认右键菜单
            window.document.oncontextmenu = function () {
                return false;
            };

            //若AmazeUI报错不识别$,则用下面的语句解决
            //var jQuery = $;

            //定义应用程序Model(论动态语言的优势，哈哈，无需在前端限定数据模型字段)
            Application = Backbone.Model.extend({});
            //从后台获取应用程序列表和数据
            var Applications = Backbone.Collection.extend({
                url: "/FSD Javascript Desktop/system/application.json",
                model: Application
            });
            //图标展示View
            AppShortcutAreaView = Backbone.View.extend({
                template: _.template($("#AppShortcutAreaView-template").html()),
                initialize: function () {
                    this.render();
                    var thisView = this;
                    $(this.el).bind("touchstart dblclick", function () {//绑定触摸和双击事件（最初设计师支持ipad触摸的，由于ipad对iframe支持不佳，已经精简了这部分功能）
                        //查询指定某个id的应用是否有打开的窗口
                        var overlappedWindows = overlappedWindowList.findWhere({appId: thisView.model.id});
                        //如果这个应用设置只能有一个窗口被打开，而且已经有窗口被打开，那么将这个程序的窗口最大化并置前
                        if (thisView.model.get("uniqueWindow") && overlappedWindows != null) {
                            eventAcrossView.trigger('overlappedWindowMaximize', {"model": overlappedWindows.collection.models[0]});
                            eventAcrossView.trigger('windowSetZIndexTop', {"model": overlappedWindows.collection.models[0]});
                        } else {//否则，打开新窗口
                            var model;
                            if (thisView.model.get("uniqueWindow")) {//如果这个应用窗口设置只能有一个窗口被打开
                                model = {
                                    "id": FSDUUID(32, 16),
                                    "appId": thisView.model.id,
                                    "title": thisView.model.get("name"),
                                    "url": thisView.model.get("url"),
                                    "icon": thisView.model.get("icon"),
                                    "minHeight": thisView.model.get("minHeight"),
                                    "minWidth": thisView.model.get("minWidth"),
                                    "width": thisView.model.get("width"),
                                    "height": thisView.model.get("height"),
                                    "overflow": thisView.model.get("overflow")
                                };

                            } else {//否则在新打开的窗口的窗口标题上增加数字作为区分
                                var sameOverlappedWindows = overlappedWindowList.where({appId: thisView.model.id});
                                model = {
                                    "id": FSDUUID(32, 16),
                                    "appId": thisView.model.id,
                                    "title": thisView.model.get("name") + "~" + (sameOverlappedWindows.length + 1),
                                    "url": thisView.model.get("url"),
                                    "icon": thisView.model.get("icon"),
                                    "minHeight": thisView.model.get("minHeight"),
                                    "minWidth": thisView.model.get("minWidth"),
                                    "width": thisView.model.get("width"),
                                    "height": thisView.model.get("height"),
                                    "overflow": thisView.model.get("overflow")
                                };
                            }
                            overlappedWindowList.add(new OverlappedWindow(model));
                        }
                    });
                },
                render: function () {
                    $(this.el).html(this.template(this.model.toJSON()));
                    return this;
                }
            });
            DesktopShortcutAreaView = Backbone.View.extend({
                el: $("#desktopShortcutArea"),
                initialize: function () {
                    this.applications = new Applications();
                    //监听applications是否有变化，有变化则执行applicationsChange
                    this.listenTo(this.applications, "change", function (model, value) {
                        this.applicationsChange();
                    });

                    var thisView = this;
                    this.applications.fetch({
                        success: function () {
                            thisView.applicationsChange();
                        }
                    });
                    this.applicationViews = [];
                },
                applicationsChange: function (data) {
                    for (var i = 0; i < this.applicationViews.length; i++) {
                        this.applicationViews[0].remove();
                    }
                    for (var i = 0; i < this.applications.length; i++) {
                        $(this.el).append("<div class='appShortcutArea' id='appShortcutArea_" + this.applications.models[i].id + "'></div>");
                        this.applicationViews.unshift(new AppShortcutAreaView({
                            model: this.applications.models[i],
                            el: $("#appShortcutArea_" + this.applications.models[i].id)
                        }));
                    }
                }
            });

            //定义窗口Model极其默认值
            OverlappedWindow = Backbone.Model.extend({
                //默认值
                defaults: {
                    //唯一标示符
                    //id: null,
                    //appId: null,
                    //title: null,
                    //icon: null,
                    //application_id:null,
                    //url: null,
                    //z_index:null,
                    maximizeBox: true,
                    minimizeBox: true,
                    keepLeftBox: true,
                    keepRightBox: true,
                    sysMenu: true,
                    variableSize: true

                }
            });

            OverlappedWindowView = Backbone.View.extend({
                template: _.template($("#OverlappedWindowView-template").html()),
                initialize: function () {
                    var thisOverlappedWindowView = this;
                    //监听window resize事件
                    this.listenTo(window, 'resize', _.debounce(this.resize));
                    eventAcrossView.on('overlappedWindowMaximize', function (data) {
                        if (data.model.id == thisOverlappedWindowView.model.id) {
                            if (!thisOverlappedWindowView.model.get("minimizeBox")) {
                                thisOverlappedWindowView.model.set("minimizeBox", true);
                            }
                        }
                    }, this);
                    //清除页面中的dom
                    this.listenTo(this.model, 'remove', this.remove);
                    this.listenTo(this.model, 'change:z_index', this.resetZIndex);
                    this.listenTo(this.model, 'change:minimizeBox', this.minimize);
                    //初始化
                    this.render();
                    //执行最大化
                    this.maximize();
                    //这个窗口
                    var t = $("#window_" + this.model.get("id"));
                    //设置层级
                    t.css('z-index', this.model.get("z_index"));

                    //变量标记拖拽移动鼠标是否被点击且未弹起
                    var MD = false, ML = false, MB = false, MT = false, MR = false, MBR = false, MBL = false, MTL = false, MTR = false;
                    //事件相对位置
                    var Rx, Ry;
                    t.bind({
                        //绑定mousedown事件
                        "mousedown": function (event) {

                            //判断事件是否来自关闭按钮以外的其他区域
                            if (!$(event.target).hasClass("closeBox")) {
                                //将本窗口置顶
                                eventAcrossView.trigger('windowSetZIndexTop', {"model": thisOverlappedWindowView.model});
                            }

                            //定义函数，为每个窗口插入遮罩层，防止鼠标在经过iframe时丢失
                            var appendWindowShade = function () {
                                $(".window").each(function () {
                                    $(this).append("<div class='window_shade' style='z-index:" + parseInt(t.css("z-index") + 1) + ";opacity:0.01;filter:alpha(opacity=1);position: absolute;left:0;top:0;width: 100%;height:100%;background: #ccc '></div>");
                                });
                            };

                            //判断事件是否来自各个 按钮、四周拖拽条和四角拖拽块 以外的其他区域
                            if (!$(event.target).hasClass("box") && !$(event.target).hasClass("dragEdge")) {

                                //计算鼠标事件在窗口中的相对位置
                                Rx = event.pageX - (parseInt(t.css("left")) || 0);
                                Ry = event.pageY - (parseInt(t.css("top")) || 0);

                                appendWindowShade();
                                //把鼠标指针改为移动状态
                                t.css('cursor', 'move');

                                //更改拖拽移动鼠标状态为点击未弹起
                                MD = true;
                            } else if ($(event.target).hasClass("dragEdgeLeft")) {
                                appendWindowShade();
                                //如果是窗口左侧拖拽条被点击，则设置相应标记为true
                                ML = true;
                            } else if ($(event.target).hasClass("dragEdgeTop")) {
                                //为每个窗口插入遮罩层，防止鼠标丢失
                                appendWindowShade();
                                //如果是窗口上侧拖拽条被点击，则设置相应标记为true
                                MT = true;
                            } else if ($(event.target).hasClass("dragEdgeRight")) {
                                //为每个窗口插入遮罩层，防止鼠标丢失
                                appendWindowShade();
                                //如果是窗口右侧拖拽条被点击，则设置相应标记为true
                                MR = true;
                            } else if ($(event.target).hasClass("dragEdgeBottom")) {
                                //为每个窗口插入遮罩层，防止鼠标丢失
                                appendWindowShade();
                                //如果是窗口下侧拖拽条被点击，则设置相应标记为true
                                MB = true;
                            } else if ($(event.target).hasClass("dragEdgeBottomRight")) {
                                //为每个窗口插入遮罩层，防止鼠标丢失
                                appendWindowShade();
                                //如果是窗口右下拖拽块被点击，则设置相应标记为true
                                MBR = true;
                            } else if ($(event.target).hasClass("dragEdgeBottomLeft")) {
                                //为每个窗口插入遮罩层，防止鼠标丢失
                                appendWindowShade();
                                //如果是窗口左下拖拽块被点击，则设置相应标记为true
                                MBL = true;
                            } else if ($(event.target).hasClass("dragEdgeTopLeft")) {
                                //为每个窗口插入遮罩层，防止鼠标丢失
                                appendWindowShade();
                                //如果是窗口左上侧拖拽块被点击，则设置相应标记为true
                                MTL = true;
                            } else if ($(event.target).hasClass("dragEdgeTopRight")) {
                                //为每个窗口插入遮罩层，防止鼠标丢失
                                appendWindowShade();
                                //如果是窗口右上侧拖拽块被点击，则设置相应标记为true
                                MTR = true;
                            }


                        },
                        "mouseup": function (event) {
                            //接收到鼠标弹起事件，确定当前窗口 不是 最大化、左停靠或者右停靠状态,而且是处于位移或改变大小状态中
                            if (thisOverlappedWindowView.model.get("maximizeBox")
                                && thisOverlappedWindowView.model.get("keepLeftBox")
                                && thisOverlappedWindowView.model.get("keepRightBox")
                                && (MD || ML || MT || MR || MB || MBR || MBL || MTL || MTR)) {

                                //记录当前窗口的坐标位置和大小
                                thisOverlappedWindowView.model.set("position_x", parseInt(t.css("left")));
                                thisOverlappedWindowView.model.set("position_y", parseInt(t.css("top")));
                                thisOverlappedWindowView.model.set("width", parseInt(t.css("width")));
                                thisOverlappedWindowView.model.set("height", parseInt(t.css("height")));

                                //以下坐标区域分别触发最大化、左停靠或者右停靠程序
                                if (event.pageX <= 5 && event.pageY > 10) {
                                    thisOverlappedWindowView.keepLeft()
                                } else if (event.pageY < 10) {
                                    thisOverlappedWindowView.maximize()
                                } else if ((window.innerWidth - event.pageX) <= 5 && event.pageY > 10) {
                                    thisOverlappedWindowView.keepRight();
                                }
                            }
                            MD = ML = MR = MT = MB = MBR = MBL = MTL = MTR = false;
                            //还原鼠标
                            t.css('cursor', 'default');
                            //删除遮罩层
                            $(".window_shade").each(function () {
                                $(this).remove();
                            });
                        }
                    });
                    $(document).bind({
                        //绑定鼠标弹起事件（全局范围）
                        "mouseup": function (event) {
                            MD = ML = MT = MR = MB = MBR = MBL = MTL = MTR = false;
                            //还原鼠标
                            t.css('cursor', 'default');
                            //删除遮罩层
                            $(".window_shade").each(function () {
                                $(this).remove();
                            });
                        },
                        //绑定鼠标移动事件（全局范围）
                        "mousemove": function (event) {
                            if (event.pageX > 0 && event.pageY > 0) {

                                //鼠标处于点击未弹起状态
                                if (MD) {
                                    //检查View是否处于最大化、左停靠、或者右停靠状态
                                    if (!thisOverlappedWindowView.model.get("maximizeBox")
                                        || !thisOverlappedWindowView.model.get("keepRightBox")
                                        || !thisOverlappedWindowView.model.get("keepLeftBox")) {
                                        //设置元素还原后的相对位置
                                        thisOverlappedWindowView.model.set("position_x", event.pageX);
                                        thisOverlappedWindowView.model.set("position_y", event.pageY - 5);
                                        //还原
                                        thisOverlappedWindowView.restore();
                                        //执行一次拖动事件响应
                                        t.css({
                                            top: event.pageY - 10,
                                            left: event.pageX - thisOverlappedWindowView.model.get("width") / 2
                                        });
                                        //重新计算相对鼠标事件位置
                                        Rx = event.pageX - (parseInt(t.css("left")) || 0);
                                        Ry = event.pageY - (parseInt(t.css("top")) || 0);
                                    } else {

                                        //确保不会超出边界
                                        if ((window.innerWidth < 1024 && event.pageX - Rx < 1024 - 30)
                                            || event.pageX - Rx < window.innerWidth - 30) {
                                            //执行拖动事件
                                            t.css({left: event.pageX - Rx});
                                        }
                                        if ((window.innerHeight < 600 && event.pageY - Ry < 600 - 30 - 15)
                                            || event.pageY - Ry < window.innerHeight - 30 - 15) {
                                            //执行拖动事件
                                            t.css({top: event.pageY - Ry});
                                        }

                                    }
                                    //改变鼠标图标
                                    t.css('cursor', 'move');

                                    //靠近自动停靠边缘时调整鼠标图标，做出指示
                                    if (event.pageX <= 5 && event.pageY > 10) {
                                        t.css('cursor', 'pointer');
                                    } else if (event.pageY < 10) {
                                        t.css('cursor', 'pointer');
                                    } else if ((window.innerWidth - event.pageX) <= 5 && event.pageY > 10) {
                                        t.css('cursor', 'pointer');
                                    }
                                }
                                var MLResize = function () {
                                    //确保窗口大于最低宽度
                                    if (parseInt(t.css("width")) - (event.pageX - parseInt(t.css("left"))) > thisOverlappedWindowView.model.get("minWidth")) {
                                        //如果当前浏览器窗口宽度小于1024，确保当前窗口可拉伸的最大宽度为1024
                                        //如果当前浏览器窗口宽度大于1024，确保当前窗口可拉伸的最大宽度为窗口宽度
                                        if ((window.innerWidth < 1024 && parseInt(t.css("width")) - (event.pageX - parseInt(t.css("left"))) < 1024)
                                            || (parseInt(t.css("width")) - (event.pageX - parseInt(t.css("left"))) < window.innerWidth)) {
                                            t.css({
                                                width: parseInt(t.css("width")) - (event.pageX - parseInt(t.css("left"))),
                                                left: event.pageX
                                            });
                                            t.find(".iframeArea").css({width: parseInt(t.css("width")) - (event.pageX - parseInt(t.css("left")))});
                                        }
                                    }
                                };
                                var MTResize = function () {
                                    //确保窗口大于最低高度
                                    if (parseInt(t.css("height")) - (event.pageY - parseInt(t.css("top"))) > thisOverlappedWindowView.model.get("minHeight")) {
                                        //如果当前浏览器窗口高度小于600，确保当前窗口可拉伸的最大高度为600-30
                                        //如果当前浏览器窗口高度大于600，确保当前窗口可拉伸的最大高度为窗口高度-30
                                        if ((window.innerHeight < 600 && parseInt(t.css("height")) - (event.pageY - parseInt(t.css("top"))) < 600 - 30)
                                            || (parseInt(t.css("height")) - (event.pageY - parseInt(t.css("top"))) < window.innerHeight - 30)) {
                                            t.css({
                                                height: parseInt(t.css("height")) - (event.pageY - parseInt(t.css("top"))),
                                                top: event.pageY
                                            });
                                            //DOM操作设置窗口中的iframe区域宽高
                                            t.find(".iframeArea").css({"height": parseInt(t.css("height")) - (event.pageY - parseInt(t.css("top"))) - 25});
                                            //t.find("iframe").css({"height": parseInt(t.css("height")) - (event.pageY - parseInt(t.css("top"))) - 25 - 10});
                                        }
                                    }
                                };
                                var MRResize = function () {
                                    //确保窗口大于最低宽度
                                    if (parseInt(t.css("width")) + (event.pageX - parseInt(t.css("left")) - parseInt(t.css("width"))) > thisOverlappedWindowView.model.get("minWidth")) {
                                        //如果当前浏览器窗口宽度小于1024，确保当前窗口可拉伸的最大宽度为1024
                                        //如果当前浏览器窗口宽度大于1024，确保当前窗口可拉伸的最大宽度为窗口宽度
                                        if ((window.innerWidth < 1024 && parseInt(t.css("width")) + (event.pageX - parseInt(t.css("left")) - parseInt(t.css("width"))) < 1024)
                                            || (parseInt(t.css("width")) + (event.pageX - parseInt(t.css("left")) - parseInt(t.css("width"))) < window.innerWidth)) {
                                            t.css({width: parseInt(t.css("width")) + (event.pageX - parseInt(t.css("left")) - parseInt(t.css("width")))});
                                            t.find(".iframeArea").css({width: parseInt(t.css("width")) + (event.pageX - parseInt(t.css("left")) - parseInt(t.css("width")))});
                                        }
                                    }
                                };
                                var MBResize = function () {
                                    //确保窗口大于最低高度
                                    if (parseInt(t.css("height")) + (event.pageY - parseInt(t.css("top")) - parseInt(t.css("height"))) > thisOverlappedWindowView.model.get("minHeight")) {
                                        //如果当前浏览器窗口高度小于600，确保当前窗口可拉伸的最大高度为600-30
                                        //如果当前浏览器窗口高度大于600，确保当前窗口可拉伸的最大高度为窗口高度-30
                                        if ((window.innerHeight < 600 && parseInt(t.css("height")) + (event.pageY - parseInt(t.css("top")) - parseInt(t.css("height"))) < 600 - 30)
                                            || (parseInt(t.css("height")) + (event.pageY - parseInt(t.css("top")) - parseInt(t.css("height"))) < window.innerHeight - 30)) {
                                            t.css({height: parseInt(t.css("height")) + (event.pageY - parseInt(t.css("top")) - parseInt(t.css("height")))});
                                            //DOM操作设置窗口中的iframe区域宽高
                                            t.find(".iframeArea").css({"height": parseInt(t.css("height")) + (event.pageY - parseInt(t.css("top")) - parseInt(t.css("height"))) - 25});
                                            //t.find("iframe").css({"height": parseInt(t.css("height")) + (event.pageY - parseInt(t.css("top")) - parseInt(t.css("height"))) - 25 - 10});
                                        }
                                    }
                                };
                                if (ML) {
                                    MLResize();
                                }
                                if (MT) {
                                    MTResize();
                                }
                                if (MR) {
                                    MRResize();
                                }
                                if (MB) {
                                    MBResize();
                                }
                                if (MBR) {
                                    MBResize();
                                    MRResize();
                                }
                                if (MBL) {
                                    MBResize();
                                    MLResize();
                                }
                                if (MTL) {
                                    MTResize();
                                    MLResize();
                                }
                                if (MTR) {
                                    MTResize();
                                    MRResize();
                                }
                            }
                        }
                    });

                    //绑定相关事件和函数
                    t.find(".maximizeBox").bind("click", function () {
                        thisOverlappedWindowView.maximize()
                    });
                    t.find(".keepLeftBox").bind("click", function () {
                        thisOverlappedWindowView.keepLeft()
                    });
                    t.find(".keepRightBox").bind("click", function () {
                        thisOverlappedWindowView.keepRight()
                    });
                    t.find(".minimizeBox").bind("click", function () {
                        if (thisOverlappedWindowView.model.get("minimizeBox")) {
                            thisOverlappedWindowView.model.set("minimizeBox", false);
                        }
                    });
                    t.find(".closeBox").bind("click", function () {
                        overlappedWindowList.remove(thisOverlappedWindowView.model);
                        thisOverlappedWindowView.remove();
                    });
                    t.find(".refreshBox").bind("click", function () {
                        thisOverlappedWindowView.refresh()
                    });

                },
                render: function () {
                    $(this.el).html(this.template(this.model.toJSON()));
                    return this;
                },
                refresh: function () {
                    //获取Dom
                    var windowDiv = $("#window_" + this.model.get("id"));
                    windowDiv.find("iframe")[0].contentWindow.location.reload();
                },
                //还原窗口函数
                restore: function () {
                    //获取Dom
                    var windowDiv = $("#window_" + this.model.get("id"));
                    //允许最大化
                    this.model.set("maximizeBox", true);
                    //允许靠左
                    this.model.set("keepLeftBox", true);
                    //允许靠右
                    this.model.set("keepRightBox", true);
                    //允许最小化
                    this.model.set("minimizeBox", true);
                    //DOM重新设置最大化图标
                    windowDiv.find(".maximizeBox").html("☐");
                    windowDiv.find(".dragEdge").show();
                    //模型是否有宽高？如果没有则执行
                    if (this.model.get("height") == null || this.model.get("width") == null) {
                        //DOM操作设置窗口为宽高为最小宽高
                        windowDiv.css({"height": this.model.get("minHeight"), "width": this.model.get("minWidth")});
                        //DOM操作设置窗口中的iframe区域宽高
                        windowDiv.find(".iframeArea").css({
                            "height": this.model.get("minHeight") - 25,
                            "width": this.model.get("minWidth")
                        });
                        //针对IE的处理
                        if (!-[1,])windowDiv.find("iframe").css({"height": this.model.get("minHeight") - 25 - 10});
                        //为宽高模型存值
                        this.model.set("height", this.model.get("minHeight"));
                        this.model.set("width", this.model.get("minWidth"));
                        //如果模型有宽高
                    } else {
                        //DOM操作设置窗口宽高
                        windowDiv.css({"height": this.model.get("height"), "width": this.model.get("width")});
                        //DOM操作设置窗口中的iframe区域宽高
                        windowDiv.find(".iframeArea").css({
                            "height": this.model.get("height") - 25,
                            "width": this.model.get("width")
                        });
                        //针对IE的处理
                        if (!-[1,])windowDiv.find("iframe").css({"height": this.model.get("height") - 25 - 10});
                    }
                    //如果模型中窗口的位置不为空
                    if (this.model.get("position_x") != null && this.model.get("position_y") != null) {
                        //还原窗口位置
                        windowDiv.css({"top": this.model.get("position_y"), "left": this.model.get("position_x")});
                    }
                },
                resize: function () {
                    //获取DOM节点
                    windowDiv = $("#window_" + this.model.get("id"));
                    var thisOverlappedWindowView = this;
                    //调整窗口模型的相关参数
                    var resizeRestoreData = function () {
                        //当前浏览器窗口高度小于600
                        if (window.innerHeight < 600) {
                            //当前窗口模型高度超出允许的高度
                            if (thisOverlappedWindowView.model.get("height") > 600 - 30) {
                                thisOverlappedWindowView.model.set("height", 600 - 30);
                            }
                            //当前窗口模型y轴坐标大于允许的距离
                            if (thisOverlappedWindowView.model.get("position_y") > 600 - 30 - 25) {
                                thisOverlappedWindowView.model.set("position_y", 600 - 30 - 25);
                            }
                            //当前浏览器窗口高度大于等于600
                        } else {
                            //当前窗口模型高度超出允许的高度
                            if (thisOverlappedWindowView.model.get("height") > window.innerHeight - 30) {
                                thisOverlappedWindowView.model.set("height", window.innerHeight - 30);
                            }
                            //当前窗口模型y轴坐标大于允许的距离
                            if (thisOverlappedWindowView.model.get("position_y") > window.innerHeight - 30 - 25) {
                                thisOverlappedWindowView.model.set("position_y", window.innerHeight - 30 - 25);
                            }
                        }
                        //当前浏览器窗口宽度小于1024
                        if (window.innerWidth < 1024) {
                            //当前窗口模型宽度超出1024
                            if (thisOverlappedWindowView.model.get("width") > 1024) {
                                thisOverlappedWindowView.model.set("width", 1024);
                            }
                            //当前窗口模型x轴坐标超出允许的最大值
                            if (thisOverlappedWindowView.model.get("position_x") > 1024 - 25) {
                                thisOverlappedWindowView.model.set("position_x", 1024 - 25);
                            }
                            //当前浏览器窗口宽度大于等于1024
                        } else {
                            //当前窗口模型宽度超出允许的最大值
                            if (thisOverlappedWindowView.model.get("width") > window.innerWidth) {
                                thisOverlappedWindowView.model.set("width", window.innerWidth);
                            }
                            //当前窗口模型x轴坐标超出允许的最大值
                            if (thisOverlappedWindowView.model.get("position_x") > window.innerWidth - 25) {
                                thisOverlappedWindowView.model.set("position_x", window.innerWidth - 25);
                            }
                        }
                    };
                    //当前窗口已为最大化
                    if (!this.model.get("maximizeBox")) {
                        //判断浏览器窗口高度是否小于600
                        if (window.innerHeight < 600) {
                            //当前窗口高度最低为570
                            windowDiv.css({"height": 600 - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({"height": 600 - 30 - 25});
                            //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else  windowDiv.find("iframe").css({"height": 600 - 30 - 25 - 10});
                        } else {
                            //窗口高度为浏览器窗口高度减去30（任务栏高度）
                            windowDiv.css({"height": window.innerHeight - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({
                                "height": window.innerHeight - 30 - 25,
                                "width": window.innerWidth
                            });
                            //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": window.innerHeight - 30 - 25 - 10});
                        }

                        //判断浏览器窗口宽度是否小于1024
                        if (window.innerWidth < 1024) {
                            //窗口最小宽度为1024
                            windowDiv.css({"width": 1024});
                        } else {
                            //窗口宽度为浏览器窗口宽度
                            windowDiv.css({"width": window.innerWidth});
                        }
                        resizeRestoreData();
                        //当前窗口目前在右侧
                    } else if (!this.model.get("keepRightBox")) {
                        //判断当前浏览器窗口高度是否小于600，如果小于，窗口高度为600，否则为实际高度
                        if (window.innerHeight < 600) {
                            windowDiv.css({"height": 600 - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({"height": 600 - 30 - 25});
                            //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": 600 - 30 - 25 -10});
                        } else {
                            windowDiv.css({"height": window.innerHeight - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({"height": window.innerHeight - 30 - 25});
                            //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": window.innerHeight - 30 - 25 - 10});
                        }
                        //判断当前浏览器窗口宽度是否小于1024，如果小于，宽度为1024/2，如果大于，则实际宽度除以2
                        if (window.innerWidth < 1024) {
                            if (this.model.get("minWidth") < 1024 / 2) {
                                windowDiv.css({"width": 1024 / 2, "left": 1024 / 2, "top": 0});
                                windowDiv.find(".iframeArea").css({"width": 1024 / 2});
                            } else {
                                windowDiv.css({
                                    "width": this.model.get("minWidth"),
                                    "left": 1024 - this.model.get("minWidth"),
                                    "top": 0
                                });
                                windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});
                            }
                        } else {
                            if (this.model.get("minWidth") < window.innerWidth / 2) {
                                windowDiv.css({
                                    "width": window.innerWidth / 2,
                                    "left": window.innerWidth / 2,
                                    "top": 0
                                });
                                windowDiv.find(".iframeArea").css({"width": window.innerWidth / 2});
                            } else {
                                windowDiv.css({
                                    "width": this.model.get("minWidth"),
                                    "left": window.innerWidth - this.model.get("minWidth"),
                                    "top": 0
                                });

                                windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});

                            }
                        }
                        resizeRestoreData();
                        //当前窗前看目前在左侧
                    } else if (!this.model.get("keepLeftBox")) {
                        if (window.innerHeight < 600) {
                            windowDiv.css({"height": 600 - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({"height": 600 - 30 - 25});
                            //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": 600 - 30 - 25 - 10});
                        } else {
                            windowDiv.css({"height": window.innerHeight - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({"height": window.innerHeight - 30 - 25});
                            //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": window.innerHeight - 30 - 25 - 10});
                        }

                        if (window.innerWidth < 1024) {
                            if (this.model.get("minWidth") < 1024 / 2) {
                                windowDiv.css({"width": 1024 / 2, "left": 0, "top": 0});
                                windowDiv.find(".iframeArea").css({"width": 1024 / 2});
                            } else {
                                windowDiv.css({"width": this.model.get("minWidth"), "left": 0, "top": 0});
                                windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});
                            }
                        } else {
                            if (this.model.get("minWidth") < window.innerWidth / 2) {
                                windowDiv.css({"width": window.innerWidth / 2, "left": 0, "top": 0});
                                windowDiv.find(".iframeArea").css({"width": window.innerWidth / 2});
                            } else {
                                windowDiv.css({"width": this.model.get("minWidth"), "left": 0, "top": 0});
                                windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});
                            }

                        }
                        resizeRestoreData();
                        //当前窗口处于调整模式
                    } else {
                        if (window.innerHeight < 600) {
                            if (windowDiv.height() > 600 - 30) {
                                windowDiv.css({"height": 600 - 30});
                                //设置窗口中iframe区域的高度
                                windowDiv.find(".iframeArea").css({"height": 600 - 30 - 25});
                                // windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": 600 - 30 - 25 - 10});
                            }
                            if (parseInt(windowDiv.css("top")) > 600 - 30 - 25) {
                                windowDiv.css({"top": 600 - 30 - 25});
                            }
                        } else {
                            if (windowDiv.height() > window.innerHeight - 30) {
                                windowDiv.css({"height": window.innerHeight - 30});
                                //设置窗口中iframe区域的高度
                                windowDiv.find(".iframeArea").css({"height": window.innerHeight - 30 - 25});
                                //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": window.innerHeight - 30 - 25 - 10});
                            }
                            if (parseInt(windowDiv.css("top")) > window.innerHeight - 30 - 25) {
                                windowDiv.css({"top": window.innerHeight - 30 - 25});
                            }
                        }

                        if (window.innerWidth < 1024) {
                            if (windowDiv.width() > 1024) {
                                windowDiv.css({"width": 1024});
                                windowDiv.find(".iframeArea").css({"width": 1024});
                            }
                            if (parseInt(windowDiv.css("left")) > 1024 - 25) {
                                windowDiv.css({"left": 1024 - 25});
                            }
                        } else {
                            if (windowDiv.width() > window.innerWidth) {
                                windowDiv.css({"width": window.innerWidth});
                                windowDiv.find(".iframeArea").css({"width": window.innerWidth});
                            }
                            if (parseInt(windowDiv.css("left")) > window.innerWidth - 25) {
                                windowDiv.css({"left": window.innerWidth - 25});
                            }
                        }
                        //这个窗口
                        var t = $("#window_" + this.model.get("id"));
                        //记录当前窗口的坐标位置和大小
                        this.model.set("position_x", parseInt(t.css("left")));
                        this.model.set("position_y", parseInt(t.css("top")));
                        this.model.set("width", parseInt(t.css("width")));
                        this.model.set("height", parseInt(t.css("height")));

                    }
                },
                close: function () {
                    this.model.destroy();
                },
                minimize: function () {
                    if (this.model.get("minimizeBox")) {
                        //$(this.el).show();
                        $(this.el).fadeIn("fast");
                        this.model.set("minimizeBox", true);
                    } else {
                        //$(this.el).hide();
                        $(this.el).fadeOut("fast");
                        this.model.set("minimizeBox", false);
                    }
                },

                //最大化函数
                maximize: function () {
                    //模型当前是否可以执行最大化程序？是
                    if (this.model.get("maximizeBox")) {
                        //获取DOM节点
                        var windowDiv = $("#window_" + this.model.get("id"));
                        //设置模型，禁止再执行最大化程序
                        this.model.set("maximizeBox", false);
                        //允许靠左
                        this.model.set("keepLeftBox", true);
                        //允许靠右
                        this.model.set("keepRightBox", true);
                        //DOM操作设置还原图标
                        windowDiv.find(".maximizeBox").html("❐");
                        windowDiv.find(".dragEdge").hide();
                        //DOM定位窗口到相对位置0,0
                        windowDiv.css({"top": 0, "left": 0});
                        //判断浏览器窗口高度是否小于600
                        if (window.innerHeight < 600) {
                            //窗口高度最低为570
                            windowDiv.css({"height": 600 - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({"height": 600 - 30 - 25});
                        } else {
                            //窗口高度为浏览器窗口高度减去30（任务栏高度）
                            windowDiv.css({"height": window.innerHeight - 30});
                            //设置窗口中iframe区域的高度
                            windowDiv.find(".iframeArea").css({"height": window.innerHeight - 30 - 25});
                        }

                        //判断浏览器窗口宽度是否小于1024
                        if (window.innerWidth < 1024) {
                            //窗口最小宽度为1024
                            windowDiv.css({"width": 1024});
                            windowDiv.find(".iframeArea").css({"width": 1024});
                        } else {
                            //窗口宽度为浏览器窗口宽度
                            windowDiv.css({"width": window.innerWidth});
                            windowDiv.find(".iframeArea").css({"width": window.innerWidth});
                        }
                        //模型当前是否可以执行最大化程序？否
                    } else {
                        //执行还原窗口程序
                        this.restore();
                    }
                },
                //右侧停靠函数
                keepRight: function () {
                    //获取DOM节点
                    var windowDiv = $("#window_" + this.model.get("id"));
                    //DOM设置允许最大化窗口图标
                    windowDiv.find(".maximizeBox").html("☐");
                    windowDiv.find(".dragEdge").hide();
                    //不再运行右侧停靠
                    this.model.set("keepRightBox", false);
                    this.model.set("maximizeBox", true);
                    //允许靠左
                    this.model.set("keepLeftBox", true);
                    //判断当前浏览器窗口高度是否小于600，如果小于，窗口高度为600，否则为实际高度
                    if (window.innerHeight < 600) {
                        windowDiv.css({"height": 600 - 30});
                        //设置窗口中iframe区域的高度
                        windowDiv.find(".iframeArea").css({"height": 600 - 30 - 25});
                        //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": 600 - 30 - 25 - 10});
                    } else {
                        windowDiv.css({"height": window.innerHeight - 30});
                        //设置窗口中iframe区域的高度
                        windowDiv.find(".iframeArea").css({"height": window.innerHeight - 30 - 25});
                        //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": window.innerHeight - 30 - 25 - 10});
                    }
                    //判断当前浏览器窗口宽度是否小于1024，如果小于，宽度为1024/2，如果大于，则实际宽度除以2
                    if (window.innerWidth < 1024) {
                        if (this.model.get("minWidth") < 1024 / 2) {
                            windowDiv.css({"width": 1024 / 2, "left": 1024 / 2, "top": 0});
                            windowDiv.find(".iframeArea").css({"width": 1024 / 2});
                        } else {
                            windowDiv.css({
                                "width": this.model.get("minWidth"),
                                "left": 1024 - this.model.get("minWidth"),
                                "top": 0
                            });
                            windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});
                        }
                    } else {
                        if (this.model.get("minWidth") < window.innerWidth / 2) {
                            windowDiv.css({"width": window.innerWidth / 2, "left": window.innerWidth / 2, "top": 0});
                            windowDiv.find(".iframeArea").css({"width": window.innerWidth / 2});
                        } else {
                            windowDiv.css({
                                "width": this.model.get("minWidth"),
                                "left": window.innerWidth - this.model.get("minWidth"),
                                "top": 0
                            });
                            windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});
                        }
                    }
                },
                keepLeft: function () {
                    //获取DOM节点
                    var windowDiv = $("#window_" + this.model.get("id"));
                    //DOM设置允许最大化窗口图标
                    windowDiv.find(".maximizeBox").html("☐");
                    windowDiv.find(".dragEdge").hide();
                    this.model.set("keepLeftBox", false);
                    this.model.set("maximizeBox", true);
                    //允许靠右侧
                    this.model.set("keepRightBox", true);
                    //请参考keepRight程序
                    if (window.innerHeight < 600) {
                        windowDiv.css({"height": 600 - 30});
                        //设置窗口中iframe区域的高度
                        windowDiv.find(".iframeArea").css({"height": 600 - 30 - 25});
                        //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": 600 - 30 - 25 - 10});
                    } else {
                        windowDiv.css({"height": window.innerHeight - 30});
                        //设置窗口中iframe区域的高度
                        windowDiv.find(".iframeArea").css({"height": window.innerHeight - 30 - 25});
                        //if(!window.VBArray) windowDiv.find("iframe").css({"height": "100%"}); else windowDiv.find("iframe").css({"height": window.innerHeight - 30 - 25 - 10});
                    }

                    if (window.innerWidth < 1024) {
                        if (this.model.get("minWidth") < 1024 / 2) {
                            windowDiv.css({"width": 1024 / 2, "left": 0, "top": 0});
                            windowDiv.find(".iframeArea").css({"width": 1024 / 2});
                        } else {
                            windowDiv.css({"width": this.model.get("minWidth"), "left": 0, "top": 0});
                            windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});
                        }
                    } else {
                        if (this.model.get("minWidth") < window.innerWidth / 2) {
                            windowDiv.css({"width": window.innerWidth / 2, "left": 0, "top": 0});
                            windowDiv.find(".iframeArea").css({"width": window.innerWidth / 2});
                        } else {
                            windowDiv.css({"width": this.model.get("minWidth"), "left": 0, "top": 0});
                            windowDiv.find(".iframeArea").css({"width": this.model.get("minWidth")});
                        }

                    }
                },
                resetZIndex: function () {
                    //获取DOM节点
                    var windowDiv = $("#window_" + this.model.get("id"));
                    //设置层级
                    windowDiv.css('z-index', this.model.get("z_index"));
                    windowDiv.find(".dragEdge").css('z-index', this.model.get("z_index") + 2);

                    if (this.model.get("z_index") == overlappedWindowList.length * 100 + 1000) {
                        //windowDiv.find(".titleBar").css({"background": "#8da7cc"});
                        windowDiv.addClass("windowTop");
                    } else {
                        //windowDiv.find(".titleBar").css({"background": "#ebebeb"});
                        windowDiv.removeClass("windowTop");
                    }
                }
            });
            WindowSectionView = Backbone.View.extend({
                template: _.template($("#WindowSectionView-template").html()),
                initialize: function () {

                    this.listenTo(this.model, 'change:z_index', this.resetZIndex);
                    this.listenTo(this.model, 'change:minimizeBox', this.resetZIndex);
                    this.render();
                    var thisWindowSectionView = this;
                    //清除页面中的dom
                    this.listenTo(this.model, 'remove', function () {
                        eventAcrossView.trigger('deleteWindowSectionViewFromArray', thisWindowSectionView);
                        thisWindowSectionView.remove();
                    });
                    //这个View所在的DOM节点
                    var t = $(thisWindowSectionView.el);
                    //View中的windowSection
                    var thisWindowSection = $('#windowSection_' + thisWindowSectionView.model.id);
                    //绑定弹出菜单
                    thisWindowSection.dropdown({justify: '#windowSectionView_' + thisWindowSectionView.model.id});
                    //定义data变量
                    var thisWindowSectionDropdownData = thisWindowSection.data('amui.dropdown');
                    //绑定关闭事件
                    $('#windowSection_' + thisWindowSectionView.model.id + '_CloseBtn').bind("mousedown", function () {
                        overlappedWindowList.remove(thisWindowSectionView.model);
                    });
                    //定义定时器变量
                    var hoverTimeOut;
                    var clickTimeOut;
                    //鼠标点击事件
                    t.bind("mousedown", function (event) {
                        //左键和中键
                        if (event.which == 1 || event.which == 2) {
                            if (thisWindowSectionView.model.get("minimizeBox") && thisWindowSectionView.model.get("z_index") != overlappedWindowList.length * 100 + 1000) {
                                eventAcrossView.trigger('windowSetZIndexTop', {"model": thisWindowSectionView.model});
                            } else if (thisWindowSectionView.model.get("minimizeBox") && thisWindowSectionView.model.get("z_index") == overlappedWindowList.length * 100 + 1000) {
                                thisWindowSectionView.model.set("minimizeBox", false);

                            } else {
                                thisWindowSectionView.model.set("minimizeBox", true);
                                eventAcrossView.trigger('windowSetZIndexTop', {"model": thisWindowSectionView.model});
                            }
                            //右键
                        } else if (event.which == 3) {
                            //是否处于激活状态
                            //$thisWindowSection.dropdown('toggle');
                            if (thisWindowSectionDropdownData.active) {
                                //关闭
                                thisWindowSection.dropdown('close');
                                //移除hover
                                thisWindowSection.removeClass("hover");
                            } else {
                                //打开
                                thisWindowSection.dropdown('open');
                                //绑定鼠标移入事件
                                thisWindowSection.mouseenter(function (e) {
                                    //添加hover class
                                    if (!thisWindowSection.hasClass("hover")) {
                                        thisWindowSection.addClass("hover");
                                    }
                                });
                                //绑定鼠标移除事件
                                thisWindowSection.mouseleave(function (e) {
                                    //移除hover
                                    thisWindowSection.removeClass("hover");
                                    //延时执行，防止鼠标移除后再次移入
                                    clearTimeout(hoverTimeOut);
                                    clearTimeout(clickTimeOut);
                                    hoverTimeOut = setTimeout(function () {
                                        //判断当前鼠标状态和当前是否处于打开状态，关闭
                                        if (!thisWindowSection.hasClass("hover") && thisWindowSectionDropdownData.active) {
                                            thisWindowSection.dropdown('close');
                                        }
                                    }, 1500);

                                });
                                //绑定点击事件
                                thisWindowSection.click(function (e) {
                                    //关闭并移除hover
                                    thisWindowSection.dropdown('close');
                                    thisWindowSection.removeClass("hover");
                                });
                                //延时执行
                                clearTimeout(hoverTimeOut);
                                clearTimeout(clickTimeOut);
                                clickTimeOut = setTimeout(function () {
                                    //如果没有hover，且处于打开状态，关闭
                                    if (!thisWindowSection.hasClass("hover") && thisWindowSection.active) {
                                        thisWindowSection.dropdown('close');
                                    }
                                }, 2500);
                            }
                        }
                    })
                },
                render: function () {
                    $(this.el).html(this.template(this.model.toJSON()));
                    return this;
                },
                resetZIndex: function () {
                    if (this.model.get("minimizeBox") == true && this.model.get("z_index") == overlappedWindowList.length * 100 + 1000) {
                        $(this.el).css("background", "#4e617b");
                        $(this.el).find(".instruction").css({"width": "130px", "margin-left": "0px"});
                    } else {
                        $(this.el).css("background", "inherit");
                        $(this.el).find(".instruction").css({"width": "120px", "margin-left": "5px"});
                    }
                }
            });
            WindowSectionExpandView = Backbone.View.extend({
                template: _.template($("#WindowSectionExpandView-template").html()),
                initialize: function () {

                    this.listenTo(this.model, 'change:z_index', this.resetZIndex);
                    this.listenTo(this.model, 'change:minimizeBox', this.resetZIndex);
                    this.render();
                    var thisWindowSectionExpandView = this;
                    //清除页面中的dom
                    this.listenTo(this.model, 'remove', function () {
                        eventAcrossView.trigger('deleteWindowSectionExpandViewFromArray', thisWindowSectionExpandView);
                        thisWindowSectionExpandView.remove();
                    });
                    var t = $(thisWindowSectionExpandView.el);
                    //绑定关闭事件
                    $('#windowSection_' + thisWindowSectionExpandView.model.id + '_CloseBtn').click(function (event) {
                        overlappedWindowList.remove(thisWindowSectionExpandView.model);
                        event.stopPropagation();
                        return false;
                    });

                    t.bind("click", function (e) {
                        if (e.which == 1 || e.which == 2) {
                            if (thisWindowSectionExpandView.model.get("minimizeBox") && thisWindowSectionExpandView.model.get("z_index") != overlappedWindowList.length * 100 + 1000) {
                                eventAcrossView.trigger('windowSetZIndexTop', {"model": thisWindowSectionExpandView.model});
                            } else if (thisWindowSectionExpandView.model.get("minimizeBox") && thisWindowSectionExpandView.model.get("z_index") == overlappedWindowList.length * 100 + 1000) {
                                thisWindowSectionExpandView.model.set("minimizeBox", false);

                            } else {
                                thisWindowSectionExpandView.model.set("minimizeBox", true);
                                eventAcrossView.trigger('windowSetZIndexTop', {"model": thisWindowSectionExpandView.model});
                            }

                        } else {

                        }
                    })
                },
                render: function () {
                    $(this.el).append(this.template(this.model.toJSON()));
                    return this;
                },
                resetZIndex: function () {
                    if (this.model.get("minimizeBox") == true && this.model.get("z_index") == overlappedWindowList.length * 100 + 1000) {
                        $(this.el).css("background", "#4e617b");
                    } else {
                        $(this.el).css("background", "inherit");
                    }
                }
            });

            //定义Explorer模型
            Explorer = Backbone.Model.extend({
                //模型RESTful get 地址
                url: '/FSD Javascript Desktop/system/explorer.json',
                //默认值
                defaults: {
                    //Explorer的背景图片
                    background_img: null,
                    //Explorer的背景颜色
                    background_color: "#C0C"

                },
                //Explorer的宽度
                width: null,
                //Explorer的高度
                height: null,
                windowSectionExpandViewArray: [],
                windowSectionViewArray: []
            });
            //定义Explorer视图
            ExplorerView = Backbone.View.extend({
                el: $("#explorer"),
                initialize: function () {
                    //从数据库读取个性化色设置
                    this.explorer = new Explorer();
                    this.explorer.fetch();

                    //监听window resize事件
                    this.listenTo(window, 'resize', _.debounce(this.explorerResizeBroadcast));
                    //监听explorer是否有变化，有变化则执行explorerChange
                    this.listenTo(this.explorer, "change", function (model, value) {
                        this.explorerChange();
                    });
                    //监听是否有新的窗口
                    this.listenTo(overlappedWindowList, 'add', this.addOne);
                    //触发设置顶层事件
                    eventAcrossView.on('windowSetZIndexTop', this.setZIndexTop, this);
                    //触发删除windowSectionView事件
                    eventAcrossView.on('deleteWindowSectionViewFromArray', this.deleteWindowSectionViewFromArray, this);
                    //触发删除windowSectionView事件
                    eventAcrossView.on('deleteWindowSectionExpandViewFromArray', this.deleteWindowSectionExpandViewFromArray, this);
                    //调整#explorer
                    this.explorerResize();
                    // 获取dom节点
                    var windowSectionAreaExpandDropdown = $('#windowSectionAreaExpandDropdown');
                    //绑定AmazeUI事件
                    windowSectionAreaExpandDropdown.dropdown({justify: '#windowSectionAreaExpand'});
                    //获取是否激活状态
                    var windowSectionAreaExpandDropdownData = windowSectionAreaExpandDropdown.data('amui.dropdown');
                    var hoverTimeOut;
                    var clickTimeOut;
                    //绑定点击事件
                    $("#windowSectionAreaExpand").bind('click', function (e) {
                        //windowSectionAreaExpandDropdown.dropdown('open');
                        //判断当前是否处于激活状态
                        if (windowSectionAreaExpandDropdownData.active) {
                            //关闭
                            windowSectionAreaExpandDropdown.dropdown('close');
                            //移除hover
                            windowSectionAreaExpandDropdown.removeClass("hover");
                        } else {
                            //打开
                            windowSectionAreaExpandDropdown.dropdown('open');
                            //绑定鼠标移入事件
                            windowSectionAreaExpandDropdown.mouseenter(function (e) {
                                //添加hover class
                                if (!windowSectionAreaExpandDropdown.hasClass("hover")) {
                                    windowSectionAreaExpandDropdown.addClass("hover");
                                }
                            });
                            //绑定鼠标移除事件
                            windowSectionAreaExpandDropdown.mouseleave(function (e) {
                                //移除hover
                                windowSectionAreaExpandDropdown.removeClass("hover");
                                //延时执行，防止鼠标移除后再次移入
                                clearTimeout(hoverTimeOut);
                                clearTimeout(clickTimeOut);
                                hoverTimeOut = setTimeout(function () {
                                    //判断当前鼠标状态和当前是否处于打开状态，关闭
                                    if (!windowSectionAreaExpandDropdown.hasClass("hover") && windowSectionAreaExpandDropdownData.active) {
                                        windowSectionAreaExpandDropdown.dropdown('close');
                                    }
                                }, 2000);

                            });
                            //绑定点击事件
                            windowSectionAreaExpandDropdown.click(function (e) {
                                //关闭并移除hover
                                windowSectionAreaExpandDropdown.dropdown('close');
                                windowSectionAreaExpandDropdown.removeClass("hover");
                            });

                            //延时执行
                            clearTimeout(hoverTimeOut);
                            clearTimeout(clickTimeOut);
                            clickTimeOut = setTimeout(function () {
                                //如果没有hover，且处于打开状态，关闭
                                if (!windowSectionAreaExpandDropdown.hasClass("hover") && windowSectionAreaExpandDropdownData.active) {
                                    windowSectionAreaExpandDropdown.dropdown('close');
                                }
                            }, 3000);
                        }
                    });
                    $("#showDeskTop").bind('touchstart click', function (e) {
                        for (var i = 0; i < overlappedWindowList.length; i++) {
                            overlappedWindowList.at(i).set("minimizeBox", false);
                        }
                    });
                    var dataTimeBar = $('#dataTimeBar');
                    var timeFunction = function time() {
                        var now = new Date();
                        //替换div内容
                        dataTimeBar.html((now.getMonth() + 1) + "月" + now.getDate()
                            + "日" + now.getHours() + ":" + now.getMinutes()
                            + ":" + now.getSeconds());
                        setTimeout(timeFunction, 1000);
                    };
                    timeFunction();
                    new DesktopShortcutAreaView;
                },
                events: {
                    "click": "explorerClickBroadcast"
                },
                explorerClickBroadcast: function () {
                    eventAcrossView.trigger('explorerClicked', {"id": "1"});
                },
                explorerResizeBroadcast: function () {
                    this.explorerResize();
                },
                explorerResize: function () {
                    //设置宽度
                    if (window.innerWidth < 1024) {
                        this.explorer.width = 1024;
                    } else {
                        this.explorer.width = window.innerWidth;
                    }
                    //设置高度
                    if (window.innerHeight < 600) {
                        this.explorer.height = 600;
                    } else {
                        this.explorer.height = window.innerHeight;
                    }
                    //调整explorer
                    $(this.el).height(this.explorer.height);
                    $(this.el).width(this.explorer.width);

                    var max;
                    if (window.innerWidth < 1024) {
                        max = parseInt((1024 - $("#systemTrayArea").width() - $("#dataTimeBar").width() - $("#showDeskTop").width() - $("#startMenu").width() - 40) / 130);
                    } else {
                        max = parseInt((window.innerWidth - $("#systemTrayArea").width() - $("#dataTimeBar").width() - $("#showDeskTop").width() - $("#startMenu").width() - 40) / 130);
                    }

                    var gap;
                    if (max < this.explorer.windowSectionViewArray.length) {
                        gap = this.explorer.windowSectionViewArray.length - max;
                        for (var i = 0; i < gap; i++) {
                            this.explorer.windowSectionViewArray[0].remove();
                            $("#windowSectionAreaExpandDropdownContentList").append("<div class='windowSection_view' id='windowSectionExpand_view_" + this.explorer.windowSectionViewArray[0].model.id + "'></div>");
                            this.explorer.windowSectionExpandViewArray.unshift(new WindowSectionExpandView({
                                model: this.explorer.windowSectionViewArray[0].model,
                                el: $("#windowSectionExpand_view_" + this.explorer.windowSectionViewArray[0].model.id)
                            }));
                            this.explorer.windowSectionViewArray.shift();
                        }

                    } else if (max > this.explorer.windowSectionViewArray.length && overlappedWindowList.length >= max) {
                        gap = max - this.explorer.windowSectionViewArray.length;
                        for (var i = 0; i < gap; i++) {
                            this.explorer.windowSectionExpandViewArray[0].remove();
                            $("#windowSectionArea").append("<div class='windowSection_view' id='windowSection_view_" + this.explorer.windowSectionExpandViewArray[0].model.id + "'></div>");
                            this.explorer.windowSectionViewArray.unshift(new WindowSectionView({
                                model: this.explorer.windowSectionExpandViewArray[0].model,
                                el: $("#windowSection_view_" + this.explorer.windowSectionExpandViewArray[0].model.id)
                            }));
                            this.explorer.windowSectionExpandViewArray.shift();
                        }

                    }
                    if (this.explorer.windowSectionExpandViewArray.length == 0 || this.explorer.windowSectionExpandViewArray.length == null) {
                        $("#windowSectionAreaExpand").hide();
                    } else {
                        $("#windowSectionAreaExpand").show();
                    }
                },

                explorerChange: function () {
                    if (this.explorer.get("background_img") != null) {
                        $(this.el).css({"background-image": this.explorer.get("background_img")});
                    } else {
                        $(this.el).css({"background": this.explorer.get("background_color")});
                    }
                    //广播事件
                    eventAcrossView.trigger('explorerChanged', {"explorer": this.explorer});
                    if (this.explorer.windowSectionExpandViewArray.length == 0 || this.explorer.windowSectionExpandViewArray.length == null) {
                        $("#windowSectionAreaExpand").hide();
                    } else {
                        $("#windowSectionAreaExpand").show();
                    }
                },
                addOne: function (overlappedWindow) {
                    //避免生成id重复的窗口
                    if (!$("#window_view_" + overlappedWindow.id).length > 0) {
                        $("#explorer").append("<div class='window_view' id='window_view_" + overlappedWindow.id + "'></div>");
                        //overlappedWindowList.get(overlappedWindow.id).set("z_index",overlappedWindowList.length * 100 +1000);
                        this.setZIndexTop({"model": overlappedWindow});
                        new OverlappedWindowView({
                            model: overlappedWindow,
                            el: $("#window_view_" + overlappedWindow.id)
                        });
                    }
                    if (!$("#windowSection_view_" + overlappedWindow.id).length > 0) {
                        var max;
                        if (window.innerWidth < 1024) {
                            max = parseInt((1024 - $("#systemTrayArea").width() - $("#dataTimeBar").width() - $("#showDeskTop").width() - $("#startMenu").width() - 40) / 130);
                        } else {
                            max = parseInt((window.innerWidth - $("#systemTrayArea").width() - $("#dataTimeBar").width() - $("#showDeskTop").width() - $("#startMenu").width() - 40) / 130);
                        }
                        if (max < overlappedWindowList.length) {
                            $("#windowSectionAreaExpandDropdownContentList").append("<div class='windowSection_view' id='windowSectionExpand_view_" + overlappedWindow.id + "'></div>");
                            this.explorer.windowSectionExpandViewArray.unshift(new WindowSectionExpandView({
                                model: overlappedWindow,
                                el: $("#windowSectionExpand_view_" + overlappedWindow.id)
                            }));
                            this.setZIndexTop({model: overlappedWindow});
                        } else {
                            $("#windowSectionArea").append("<div class='windowSection_view' id='windowSection_view_" + overlappedWindow.id + "'></div>");
                            this.explorer.windowSectionViewArray.unshift(new WindowSectionView({
                                model: overlappedWindow,
                                el: $("#windowSection_view_" + overlappedWindow.id)
                            }));
                            this.setZIndexTop({model: overlappedWindow});
                        }
                    }

                    if (this.explorer.windowSectionExpandViewArray.length == 0 || this.explorer.windowSectionExpandViewArray.length == null) {
                        $("#windowSectionAreaExpand").hide();
                    } else {
                        $("#windowSectionAreaExpand").show();
                    }
                },

                setZIndexTop: function (data) {
                    for (i = 0; i < overlappedWindowList.length; i++) {
                        if (overlappedWindowList.at(i).get("z_index") > data.model.get("z_index")) {
                            overlappedWindowList.at(i).set("z_index", overlappedWindowList.at(i).get("z_index") - 100);
                            //对id未变的窗口触发一次变化事件
                        } else {
                            overlappedWindowList.at(i).set("z_index", overlappedWindowList.at(i).get("z_index") - 1);
                            overlappedWindowList.at(i).set("z_index", overlappedWindowList.at(i).get("z_index") + 1);
                        }
                    }
                    //对顶层窗口触发一次变化事件
                    overlappedWindowList.get(data.model.id).set("z_index", overlappedWindowList.length * 100 + 999);
                    overlappedWindowList.get(data.model.id).set("z_index", overlappedWindowList.length * 100 + 1000);
                },
                deleteWindowSectionViewFromArray: function (data) {
                    for (var i = 0; i < this.explorer.windowSectionViewArray.length; i++) {
                        if (this.explorer.windowSectionViewArray[i].model.id == data.model.id) {
                            this.explorer.windowSectionViewArray.splice(i, 1);
                            break;
                        }
                    }
                    var max;
                    if (window.innerWidth < 1024) {
                        max = parseInt((1024 - $("#systemTrayArea").width() - $("#dataTimeBar").width() - $("#showDeskTop").width() - $("#startMenu").width() - 40) / 130);
                    } else {
                        max = parseInt((window.innerWidth - $("#systemTrayArea").width() - $("#dataTimeBar").width() - $("#showDeskTop").width() - $("#startMenu").width() - 40) / 130);
                    }


                    if (max > this.explorer.windowSectionViewArray.length && overlappedWindowList.length >= max) {
                        var gap = max - this.explorer.windowSectionViewArray.length;
                        for (var i = 0; i < gap; i++) {
                            this.explorer.windowSectionExpandViewArray[0].remove();
                            $("#windowSectionArea").append("<div class='windowSection_view' id='windowSection_view_" + this.explorer.windowSectionExpandViewArray[0].model.id + "'></div>");
                            this.explorer.windowSectionViewArray.unshift(new WindowSectionView({
                                model: this.explorer.windowSectionExpandViewArray[0].model,
                                el: $("#windowSection_view_" + this.explorer.windowSectionExpandViewArray[0].model.id)
                            }));
                            this.explorer.windowSectionExpandViewArray.shift();
                        }

                    }
                    if (this.explorer.windowSectionExpandViewArray.length == 0 || this.explorer.windowSectionExpandViewArray.length == null) {
                        $("#windowSectionAreaExpand").hide();
                    } else {
                        $("#windowSectionAreaExpand").show();
                    }
                },
                deleteWindowSectionExpandViewFromArray: function (data) {
                    for (var i = 0; i < this.explorer.windowSectionExpandViewArray.length; i++) {
                        if (this.explorer.windowSectionExpandViewArray[i].model.id == data.model.id) {
                            this.explorer.windowSectionExpandViewArray.splice(i, 1);
                            break;
                        }
                    }
                    if (this.explorer.windowSectionExpandViewArray.length == 0 || this.explorer.windowSectionExpandViewArray.length == null) {
                        $("#windowSectionAreaExpand").hide();
                    } else {
                        $("#windowSectionAreaExpand").show();
                    }
                }
            });

            //事件中继
            var eventAcrossView = _.extend({}, Backbone.Events);
            //window resize事件广播
            _.extend(window, Backbone.Events);

            var screenTooSmallModal = $('#screen-too-small-modal');
            var screenTooSmallModalFuc = function () {
                if (window.innerHeight < 600 || window.innerWidth < 1024) {
                    if (!screenTooSmallModal.hasClass("am-modal-active")) {
                        screenTooSmallModal.modal();
                    }
                } else {
                    if (screenTooSmallModal.hasClass("am-modal-active")) {
                        screenTooSmallModal.modal('close');
                    }
                }
            };

            screenTooSmallModalFuc();
            window.onresize = function () {
                window.trigger('resize');
                screenTooSmallModalFuc();
            };

            OverlappedWindowList = Backbone.Collection.extend({
                model: OverlappedWindow
            });
            var overlappedWindowList = new OverlappedWindowList;
            //实例化AppView
            new ExplorerView;
        })(jQuery);
    });
});